<template>
    <div>
        <child-header>
            <template #title>
                <div>
                    预约旅程
                </div>
            </template>
        </child-header>
        <van-address-list v-model="chosenAddressId" :list="list" :disabled-list="disabledList"
            disabled-text="以下预约已经失效" add-button-text="新增预约" default-tag-text="最新预约" @add="onAdd" @edit="onEdit"/>
    </div>
</template>

<script setup>
import ChildHeader from '@/components/ChildHeader.vue'
import { ref } from 'vue'

const list = [
    {
        id: 1,
        name: '张三',
        tel: '13000000000',
        address: '2024-07-05 大连-新加坡',
        isDefault: true,
    },
]

const disabledList = [
    {
        id: 2,
        name: '赵六',
        tel: '1330000000',
        address: '2024-07-01 大连-中国台湾',
        isDefault: false,
    },
    {
        id: 3,
        name: '孙七',
        tel: '1340000000',
        address: '2024-07-02 大连-日本',
        isDefault: false,
    },
]

const chosenAddressId = ref(1)

const onAdd = () => {
    console.log('onAdd')
}

const onEdit = () => {
    console.log('onEdit')
}
</script>

<style scoped></style>